<!-- 注意这里不需要写`<html><body>`这些东西，它是一个html片段，不是完整的html页面 -->
<form id="addOrUpdateForm" lay-filter="addOrUpdateForm" class="layui-form model-form">
    <input name="id" type="hidden"/>
    <div class="layui-form-item">
        <label class="layui-form-label layui-form-required">授权URL：</label>
        <div class="layui-input-block">
            <input name="navUrl" class="layui-input" placeholder="请输入授权URL" lay-verType="tips" lay-verify="required"
                   required/>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label layui-form-required">授权QQ：</label>
        <div class="layui-input-block">
            <input name="navQq" class="layui-input" placeholder="请输入授权QQ" lay-verType="tips" lay-verify="required"
                   required/>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label layui-form-required">授权Email：</label>
        <div class="layui-input-block">
            <input name="navEmail" class="layui-input" lay-verify="email" placeholder="请输入授权Email" lay-verType="tips"
                   required/>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label layui-form-required">授权时长：</label>
        <div class="layui-input-block">
            <input type="radio" name="navTime" lay-filter="linktype" value="1" title="一年" checked>
            <input type="radio" name="navTime" lay-filter="linktype" value="2" title="永久">
            <input type="radio" name="navTime" lay-filter="linktype" value="3" title="套餐永久" disabled>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label layui-form-required">授权价格：</label>
        <div class="layui-input-block">
            <!--一年    -->
            <div id="viewscore">
                <div class="layui-form-mid" style="font-size: 23px; color: #FF5722;">￥ <font id="year"></font></div>
            </div>
            <!--永久-->
            <div id="viewscores" style="display: none;">
                <div class="layui-form-mid" style="font-size: 23px; color: #FF5722;">￥ <font id="permanent"></font>
                </div>
            </div>
        </div>
        <!--永久套餐-->
        <div id="viewscore3" style="display: none;">
            <div class="layui-form-mid" style="font-size: 23px; color: #FF5722;">￥<font>278.0</font></div>
        </div>
    </div>
    </div>


    <div class="layui-form-item text-right">
        <button class="layui-btn layui-btn-primary" type="button" ew-event="closeDialog">取消</button>
        <button class="layui-btn" lay-filter="formSubmitBtn" lay-submit>保存</button>
    </div>
</form>

<script>
    layui.use(['layer', 'form', 'admin', 'xnUtil'], function () {
        var $ = layui.jquery;
        var layer = layui.layer;
        var form = layui.form;
        var admin = layui.admin;

        var price;

        function price() {
            $.ajax({
                //几个参数需要注意一下
                type: "GET",//方法类型
                dataType: "json",//预期服务器返回的数据类型
                url: "/sysAuth/price",//url
                success: function (result) {
                    $("#year").text(result.year + '.0');
                    $("#permanent").text(result.permanent + '.0');
                }
            });
        }
        price();
        form.on('radio(linktype)',
            function (data) {
                if (data.value == 1) {
                    $("#viewscore").show();
                }
                if (data.value == 1) {
                    $("#viewscores").hide();
                    $("#viewscore3").hide();
                    $("#viewscore9").hide();
                }
                if (data.value == 2) {
                    $("#viewscore").hide();
                    $("#viewscore3").hide();
                    $("#viewscore9").hide();
                }
                if (data.value == 2) {
                    $("#viewscores").show();
                }

                if (data.value == 3) {
                    $("#viewscore").hide();
                    $("#viewscores").hide();
                    $("#viewscore9").hide();
                }
                if (data.value == 3) {
                    $("#viewscore3").show();
                }


                if (data.value == 9) {
                    $("#viewscore").hide();
                    $("#viewscores").hide();
                    $("#viewscore3").hide();
                }
                if (data.value == 9) {
                    $("#viewscore9").show();
                }

            });

        var editData = admin.getLayerData('#addOrUpdateForm').data;

        form.val('addOrUpdateForm', editData);
        // 表单提交事件
        form.on('submit(formSubmitBtn)', function (data) {
            layer.load(2);
            var url = editData ? getProjectUrl() + 'sysAuth/edit' : getProjectUrl() + 'sysAuths/add';
            admin.req(url, JSON.stringify(data.field), function (res) {
                layer.msg(res.message, {icon: 1, time: 1000}, function () {
                    admin.putLayerData('formOk', true, '#addOrUpdateForm');
                    admin.closeDialog('#addOrUpdateForm');
                });
            }, 'post');
            return false;
        });

    });
</script>